<template>
  <div class="rateQuery">
    <div style="width: 100%">
      <a-row style="background: rgb(191 191 191); padding: 10px">
        <a-col :span="12"><div>功能名称</div> </a-col>
        <a-col :span="12"><div style="padding-left: 44px">费率</div> </a-col>
      </a-row>
      <div
        v-for="(value, key, index) in ratelist"
        :key="index"
        class="rateTable"
      >
        <div v-if="value != null && value.length > 1">
          <a-row>
            <a-col style="cursor: pointer" @click="clickPlus(index)" :span="12">
              <span><a-icon type="plus-square" /></span>
              {{ key }}
            </a-col>
            <a-col :span="12" @click="clickPlus(index)"
              ><span>&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&nbsp;</span> 点击展开
            </a-col>
          </a-row>
          <a-row style="margin-top: 15px" v-if="context[index].status">
            <a-col :span="24">
              <div v-for="(valItem, valIndex) in value" :key="valIndex">
                <br />
                <a-row>
                  <a-col :span="12">
                    {{ valItem.productName }}
                  </a-col>
                  <a-col :span="12">
                    <span>
                      <span>&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&nbsp;</span>
                      {{ value[valIndex].feeTemplate | feeTemplate }}
                    </span>
                  </a-col>
                </a-row>
              </div>
            </a-col>
          </a-row>
        </div>
        <div v-if="value != null && value.length === 1">
          <a-row>
            <a-col :span="12">
              <div v-if="value != null && value.length > 1">+</div>
              {{ key }}
            </a-col>
            <a-col :span="12">
              <div v-for="(valItem, valIndex) in value" :key="valIndex">
                <a-row>
                  <a-col :span="18">
                    <span v-if="value[valIndex].name != 'D0'">
                      <span v-if="value[valIndex].feeTemplate.hasOwnProperty('manual')">
                        手动提现:
                        {{
                          Number(value[valIndex].feeTemplate.manual.amount) /
                          100
                        }}
                        元/笔 ; 自动提现:
                        {{ value[valIndex].feeTemplate | feeTemplate }}
                      </span>
                      <span v-else>
                        {{ value[valIndex].feeTemplate | feeTemplate }}
                      </span>

                      <!-- {{value[valIndex].feeTemplate | feeTemplate}} -->
                    </span>
                    <span v-if="value[valIndex].name == 'D0'">
                      <span>&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&nbsp;</span>
                      <span
                        >D0垫资:{{
                          parseFloat(value[valIndex].feeTemplate.rate).toFixed(
                            4
                          )
                        }}%</span
                      >
                      <br />
                      <span>&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&nbsp;</span>
                      <span
                        >D0单笔:{{
                          value[valIndex].feeTemplate.amount
                        }}元/笔</span
                      >
                    </span>
                  </a-col>
                </a-row>
              </div>
            </a-col>
          </a-row>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  components: {},
  props: {
    MerRateList: Object,
  },
  watch: {
    MerRateList: {
      deep: true, // 深度监听
      handler(newVal, oldVal) {
        //  console.log(newVal,oldVal)
        if (newVal != oldVal) {
          this.MerRateList = newVal;
          this.setratelist();
        }
      },
    },
  },
  data() {
    return {
      ratelist: [],
      context: [],
      templateBankDTOList: [],
      feeTemplateList: [],
      formItemLayout: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 20 },
          md: { span: 16 },
        },
      },
    };
  },
  mounted() {
    this.feeTemplateList = [];
  },

  methods: {
    inputValue(index, value, min) {
      if (value == "" || value == undefined) {
        return min;
      }
    },

    verifyValue(name, value, min) {
      if (value == "" || value == undefined) {
        this.$message.error("请输入正确的数值");
      }
      if (value < min) {
        this.$message.info(name + "费率不得低于" + min);
      }
    },

    clickPlus(index) {
      console.log(this.context[index].status);
      this.context[index].status = !this.context[index].status;
    },
    setratelist() {
      this.ratelist = this.MerRateList;
      this.context = [];

      for (let idx in this.ratelist) {
        // console.log("ratelist.idx",this.ratelist[idx])
        if (this.ratelist[idx].length == 1) {
          this.context.push({ status: true });
        } else {
          this.context.push({ status: false });
        }
        for (let idx2 in this.ratelist[idx]) {
          this.ratelist[idx][idx2].feeTemplate = JSON.parse(
            this.ratelist[idx][idx2].feeTemplate
          );
          //默认值
          if (this.ratelist[idx][idx2].feeTemplate.rate != null) {
            this.ratelist[idx][idx2].feeTemplate.rate =
              Math.round(this.ratelist[idx][idx2].feeTemplate.rate * 1000000) /
              10000;
            if (this.ratelist[idx][idx2].name == "D0") {
              this.ratelist[idx][idx2].feeTemplate.amount =
                this.ratelist[idx][idx2].feeTemplate.amount / 100;
            }
            if (this.ratelist[idx][idx2].name == "pos借记") {
              this.ratelist[idx][idx2].feeTemplate.top =
                this.ratelist[idx][idx2].feeTemplate.top / 100;
            }
            if (
              this.ratelist[idx][idx2].productCode == "unionpay.qrcode.face.d"
            ) {
              this.ratelist[idx][idx2].feeTemplate.top =
                this.ratelist[idx][idx2].feeTemplate.top / 100;
            }
            if (
              this.ratelist[idx][idx2].productCode == "unionpay.qrcode.big.d"
            ) {
              this.ratelist[idx][idx2].feeTemplate.top =
                this.ratelist[idx][idx2].feeTemplate.top / 100;
            }
          } else {
            this.ratelist[idx][idx2].feeTemplate.amount =
              this.ratelist[idx][idx2].feeTemplate.amount / 100;
          }

          //最小值费率
          this.ratelist[idx][idx2].minFee = JSON.parse(
            this.ratelist[idx][idx2].minFee
          );
          if (this.ratelist[idx][idx2].minFee.rate != null) {
            this.ratelist[idx][idx2].minFee.rate =
              Math.round(this.ratelist[idx][idx2].minFee.rate * 1000000) /
              10000;
            if (this.ratelist[idx][idx2].name == "D0") {
              this.ratelist[idx][idx2].minFee.amount =
                this.ratelist[idx][idx2].minFee.amount / 100;
            }
            if (this.ratelist[idx][idx2].name == "pos借记") {
              this.ratelist[idx][idx2].minFee.top =
                this.ratelist[idx][idx2].minFee.top / 100;
            }
            if (
              this.ratelist[idx][idx2].productCode == "unionpay.qrcode.face.d"
            ) {
              this.ratelist[idx][idx2].minFee.top =
                this.ratelist[idx][idx2].minFee.top / 100;
            }
            if (
              this.ratelist[idx][idx2].productCode == "unionpay.qrcode.big.d"
            ) {
              this.ratelist[idx][idx2].minFee.top =
                this.ratelist[idx][idx2].minFee.top / 100;
            }
          } else {
            this.ratelist[idx][idx2].minFee.amount =
              this.ratelist[idx][idx2].minFee.amount / 100;
          }
        }
      }
    },
    rateConversion() {
    
      for (let idx in this.ratelist) {
        if (this.ratelist[idx].length == 1) {
          if (idx == "D0") {
            if (
              this.ratelist[idx][0].feeTemplate.rate <
              this.ratelist[idx][0].minFee.rate
            ) {
              this.$message.info("D0垫资费率超过限制");
              return false;
            }
            if (this.ratelist[idx][0].minFee.amount != 0) {
              if (
                this.ratelist[idx][0].feeTemplate.amount <
                this.ratelist[idx][0].minFee.amount
              ) {
                this.$message.info("D0单笔费率超过限制");
                return false;
              }
            }
          } else {
            if (
              this.ratelist[idx][0].feeTemplate.rate <
              this.ratelist[idx][0].minFee.rate
            ) {
              this.$message.info(idx + "费率超过限制");
              return false;
            }

            if (this.ratelist[idx][0].name == "pos借记") {
              if (
                this.ratelist[idx][0].feeTemplate.top <
                this.ratelist[idx][0].minFee.top
              ) {
                this.$message.info(idx + "费率超过限制");
                return false;
              }
            }
          }
        } else {
          for (let idx2 in this.ratelist[idx]) {
            if (
              this.ratelist[idx][idx2].feeTemplate.rate <
              this.ratelist[idx][idx2].minFee.rate
            ) {
              this.$message.info(
                this.ratelist[idx][idx2].productName + "费率超过限制"
              );
              return false;
            }
            if (this.ratelist[idx][idx2].feeTemplate.top) {
              if (
                this.ratelist[idx][idx2].feeTemplate.top <
                this.ratelist[idx][idx2].minFee.top
              ) {
                this.$message.info(
                  this.ratelist[idx][idx2].productName + "费率超过限制"
                );
                return false;
              }
            }
          }
        }
      }

      let feeAddRequestList = [];
      for (let Chargeidx in this.ratelist) {
        let data = {
          id: "",
          feeTemplate: "",
          open: false,
        };
        if (this.ratelist[Chargeidx].length == 1) {
          data.id = this.ratelist[Chargeidx][0].id;
          data.open = this.ratelist[Chargeidx][0].open || false;
          if (Chargeidx == "D0") {
            data.feeTemplate =
              '{"rate":' +
              Math.round(this.ratelist[Chargeidx][0].feeTemplate.rate * 10000) /
                1000000 +
              ',"amount":' +
              Math.round(this.ratelist[Chargeidx][0].feeTemplate.amount * 100) +
              ',"settle_percent":' +
              this.ratelist[Chargeidx][0].feeTemplate.settle_percent +
              "}";
          } else if (Chargeidx == "pos借记") {
            data.feeTemplate =
              '{"rate":' +
              Math.round(this.ratelist[Chargeidx][0].feeTemplate.rate * 10000) /
                1000000 +
              ',"top":' +
              Math.round(this.ratelist[Chargeidx][0].feeTemplate.top * 100) +
              "}";
          } else {
            data.feeTemplate =
              '{"rate":' +
              Math.round(this.ratelist[Chargeidx][0].feeTemplate.rate * 10000) /
                1000000 +
              "}";
          }

          feeAddRequestList.push(data);
        } else {
          for (let Chargeidx2 in this.ratelist[Chargeidx]) {
            let exdata = {
              id: this.ratelist[Chargeidx][Chargeidx2].id,
              open: this.ratelist[Chargeidx][0].open || false,
              feeTemplate: "",
            };
            if (
              this.ratelist[Chargeidx][Chargeidx2].productCode ==
              "unionpay.qrcode.face.d"
            ) {
              exdata.feeTemplate =
                '{"rate":' +
                Math.round(
                  this.ratelist[Chargeidx][Chargeidx2].feeTemplate.rate * 10000
                ) /
                  1000000 +
                ',"top":' +
                Math.round(
                  this.ratelist[Chargeidx][Chargeidx2].feeTemplate.top * 100
                ) +
                "}";
            } else {
              exdata.feeTemplate =
                '{"rate":' +
                Math.round(
                  this.ratelist[Chargeidx][Chargeidx2].feeTemplate.rate * 10000
                ) /
                  1000000 +
                "}";
            }
            feeAddRequestList.push(exdata);
          }
        }
      }

      console.log("feeAddRequestList", feeAddRequestList);
      this.feeTemplateList = feeAddRequestList;
    },
  },
};
</script>
<style lang="less" scoped>
/deep/.noExpand {
  .ant-table-row-expand-icon {
    display: none;
  }
}
.rateTable {
  border-bottom: 1px solid #cccccc;
  padding: 20px 0;
}
.rateQuery {
  overflow: scroll;
  height: 100%;
  /* padding: 30px; */
  overflow-x: hidden;
  overflow-y: auto;
}
/*滚动条样式*/
.rateQuery::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 4px;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 4px;
}

.rateQuery::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 5px;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: rgba(0, 0, 0, 0.2);
}

.rateQuery::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 0;
  background: rgba(0, 0, 0, 0.1);
}
.ratebutton {
  text-align: center;
}
</style>
